import { defineStore } from 'pinia'
import type { TagsViewState, TagView } from './types/tagsViewState'
import { store } from '@/stores'
import { transformI18n } from '@/plugins/i18n'

export const useTagsView = defineStore({
  id: 'simple-tags-view',
  state: (): TagsViewState => ({
    tagsViewList: [
      {
        path: '/admin/welcome',
        title: transformI18n('menus.home')
      }
    ],
    activeTag: '/admin/welcome'
  }),
  actions: {
    /**
     * 设置激活的标签
     * @param path
     */
    setActiveTag(path: string) {
      this.activeTag = path
    },
    /**
     * 语言切换刷新tags
     * @param to
     * @param from
     * @param keys
     */
    refreshTagsView(to: string, from: any, keys: any) {
      let tagsMenuKey: any[] = []
      for (let k in keys) {
        this.tagsViewList.forEach((item) => {
          if (keys[k] == item.title) {
            tagsMenuKey.push(k)
          }
        })
      }
      this.tagsViewList.forEach((item, index) => {
        item.title = transformI18n(tagsMenuKey[index], from)
      })
    },
    /**
     * 添加标签
     * @param path 路径
     * @param title 标题
     */
    addTagsView(path: string, title: string) {
      if (path == '/403' || path == '/404' || path == '/500') return
      if (this.tagsViewList.findIndex((item: TagView) => item.path === path) === -1) {
        if (path == '/admin/welcome') return
        this.tagsViewList.push({
          path: path,
          title: transformI18n(title as any) || title
        })
      }
    },
    /**
     * 关闭当前
     * @param tageItem
     * @param callback
     */
    closeCurrent(tageItem: TagView, callback: (item: TagView) => void) {
      if (this.tagsViewList.length === 1) return
      let index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      if (index == 0) return
      this.tagsViewList.splice(index, 1)
      callback(this.tagsViewList[index - 1])
    },
    /**
     * 关闭左侧
     * @param tageItem
     */
    closeLeft(tageItem: TagView) {
      const index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      if (index > 0) {
        this.tagsViewList.splice(1, index - 1)
      }
    },
    /**
     * 关闭右侧
     * @param tageItem
     */
    closeRight(tageItem: TagView) {
      const index = this.tagsViewList.findIndex((item: TagView) => item.path === tageItem.path)
      if (index < this.tagsViewList.length - 1) {
        this.tagsViewList.splice(index + 1, this.tagsViewList.length - index - 1)
      }
    },
    /**
     * 关闭其它
     * @param tageItem
     */
    closeOther(tageItem: TagView) {
      // 找到当前标签的索引
      const currentIndex = this.tagsViewList.findIndex(
        (item: TagView) => item.path === tageItem.path
      )
      // 找到第一项的索引
      console.log(this.tagsViewList)
      const firstItemIndex = this.tagsViewList.findIndex((item: TagView) => item.path == '/') // 假设有一个isFirst属性来标识第一项

      // 过滤掉除了当前标签和第一项之外的所有标签
      this.tagsViewList = this.tagsViewList.filter(
        (item: TagView, index: number) => index === currentIndex || index === firstItemIndex
      )
    },
    /**
     * 全部关闭
     * @param tageItem
     * @param callback
     */
    closeAll(tageItem: TagView, callback: (item: TagView) => void) {
      // 保留数组的第一项，如果存在
      if (this.tagsViewList.length > 0) {
        this.tagsViewList = [this.tagsViewList[0]]
        callback(this.tagsViewList[0])
      } else {
        this.tagsViewList = [] // 如果数组为空，则清空
      }
    },
    /**
     * 清空
     */
    clearTagsView() {
      this.tagsViewList = [
        {
          path: '/admin/welcome',
          title: transformI18n('menus.home')
        }
      ]
      this.activeTag = '/admin/welcome'
    }
  },
  persist: {
    key: 'education-simple-tags-view',
    storage: localStorage
  }
})

export function useTagsViewStoreHook() {
  return useTagsView(store)
}
